<template>
  <!--基本信息  -->
  <div class="wrapper" style="width:500px; margin:0 auto">
    <FormPanel
      ref="formPanel"
      :list="initForm"
      :cols="1"
      :labelWidth="130"
      :isSubmitBtn="false"
      @formChange="formChangeHandle"
    />
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDialog">取 消</el-button>
      <el-button @click="saveDialog" :loading="saveLoading" type="primary">修改</el-button>
    </div>
  </div>
</template>

<script>
import { authority } from '@/utils/authMixin';
import { dictionary } from '@/utils/dictMixin';
import { addMaterialType, updateMaterialType } from '@/api/cms-api/projectOperating/definition/materialType/index';
export default {
  mixins: [authority, dictionary],
  props: {
    rowData: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    this.saveData = null;
    return {
      initForm: this.initFormFun(),
      parentTypeId: this.rowData.parentTypeId,
      saveLoading: false,
      formValue: {},
      levelMap:{0:'0',1:'一级',2:'二级',3:'三级',4:'四级',5:'五级',6:'六级',7:'七级'},
      materialTypeLevel:0
    };
  },
  computed: {},
  created() {
    this.init();
  },
  methods: {
    created() {
      this.init();
    },
    saveDialog() {
      this.$refs.formPanel.SUBMIT_FORM();
    },

    async formChangeHandle(val) {
      this.formValue = val;
      if (this.formValue !== null) {
        this.saveLoading = true;
        this.formValue = Object.assign({}, this.formValue, { parentTypeId: this.parentTypeId ,'materialTypeLevel':this.materialTypeLevel});
        let res = {};
        res = await updateMaterialType(this.formValue, this.rowData.materialTypeId);
        if (res.resultCode === 200) {
          this.$notify.success({ title: '提示信息', message: '提交成功!' });
          this.closeDialog('refresh');
        }
      }
    },

    init() {
      this.initForm.forEach(x => {
        
        if(x.fieldName == 'parentMaterialTypeLevel'){
          let top = this.rowData.parentMaterialTypeLevel;
          //将上级营销素材类型等级显示为汉字
          x.initialValue = this.levelMap[top];
        }else if(x.fieldName == 'materialTypeLevelName'){
          //将营销素材类型等级显示为汉字
          this.materialTypeLevel = this.rowData.materialTypeLevel;
          x.initialValue = this.levelMap[this.materialTypeLevel];
        }else{
          x.initialValue = this.rowData[x.fieldName];
        }
      });
    },
    //搜索数据
    initFormFun() {
      return [
        {
          type: 'INPUT',
          label: '上级营销素材类型ID:',
          fieldName: 'parentTypeId',
          placeholder: '',
          hidden: true,
          disabled: true
        },
        {
          type: 'INPUT',
          label: '上级营销素材类型编号',
          fieldName: 'parentMaterialTypeCode',
          disabled: true,
          placeholder: '',
          style: { width: '300px' }
        },
        {
          type: 'INPUT',
          label: '上级营销素材类型名称',
          fieldName: 'parentMaterialTypeName',
          placeholder: '',
          disabled: true,
          style: { width: '300px' }
        },
        {
          type: 'INPUT',
          label: '上级营销素材类型等级',
          fieldName: 'parentMaterialTypeLevel',
          placeholder: '',
          disabled: true,
          style: { width: '300px' }
        },
        {
          type: 'INPUT',
          label: '营销素材类型名称:',
          placeholder: '',
          fieldName: 'materialTypeName',
          disabled: false,
          style: { width: '300px' },
          rules: [{ required: true, message: '请输入营销素材类型名称', trigger: 'blur' }, { max: 20, message: '营销素材类型名称长度不能超过20', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '营销素材类型代码:',
          placeholder: '',
          fieldName: 'materialTypeCode',
          disabled: true,
          style: { width: '300px' },
          rules: [{ required: true, message: '请输入营销素材类型代码', trigger: 'blur' }, { max: 20, message: '营销素材类型代码长度不能超过20', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '营销素材类型等级:',
          placeholder: '',
          fieldName: 'materialTypeLevelName',
          disabled: true,
          style: { width: '300px' },
          // rules: [{ required: true, message: '请输入营销素材类型等级', trigger: 'blur' }, { pattern: /^[1-9]$/, message: '请填非零一位整数', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '可用状态',
          fieldName: 'isSend',
          placeholder: '',
          itemList: this.createDictList('1003'),
          style: { width: '300px' },
          rules: [{ required: true, message: '请选择是否推送', trigger: 'blur' }]
        },
        {
          type: 'TEXT_AREA',
          label: '营销素材类型描述',
          fieldName: 'materialTypeDesc',
          readonly: true,
          placeholder: '',
          style: { width: '300px' },
          rules: [{ max: 200, message: '营销素材类型名称长度不能超过200', trigger: 'blur' }]
        }
      ];
    },
    closeDialog(param) {
      this.$emit('close', false, param);
    }
  }
};
</script>
<style scoped>
.wrapper {
  height: calc(100vh - 110px);
}
</style>
